$(function() {
	(function ($) {
        $.getUrlParam = function (name) {
            var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
            var r = window.location.search.substr(1).match(reg);
            if (r != null) return decodeURI(r[2]); return null;
        }
    })(jQuery);
	$(document).on("click","a",function(){
		var id = $(this).attr("id");
		if(id!=null){
			if($(this).attr("name")!=null&&$(this).attr("name")=="del"){
				$(this).parent().parent().slideUp("slow");
				fetch('./del.do?id='+id)
			}
		}
	})
	var page = $.getUrlParam('page');
	var url ='./list.do?type=json';
	if(page!=null){
		url = url +'&page='+page;
	}
	fetch(url)
	.then(function(response) {
		return response.json();
	})
	.then(
	function(build) {
		var $ul = $('#list-articles');
		var articles = build.articles;
		var currentPage = build.currentPage;
		var total = build.total;
		articles.forEach(function(art) {
			$ul.append('<li class="list-group-item">' + '<h3>'
					+ art.title + '</h3>' + '<p>' + art.content
					+ '</p>' + '<p>' + art.publishDate
					+ '</p>' + '<p>' +'<a id='+ art.id +' name="del"><span>删除</span></a>'
					+ '</p></li>')
					
		})
		$ul = $('#pagination');
		
		console.log('total: ' + total);

		if (currentPage == 0) {
			console.log('currentPage: ' + currentPage);
			$ul.append('<li class="disabled"><span>&laquo;</span></li>')
		} else {
			console.log('currentPage: ' + currentPage);
			$ul.append('<li ><a href="./jslist.jsp?type=json&page=' +
					(currentPage - 1) +
					'">&laquo;</a></li>')
		}
		
		if(currentPage<5){
			for(var i=0;i<6;i++){
				if(i==currentPage){
					$ul.append('<li class="active"><a href="./jslist.jsp?type=json&page=' +
							i + '">'+
							i +'</a></li>')
				}else{
					$ul.append('<li><a href="./jslist.jsp?type=json&page=' +
							i + '">'+
							i +'</a></li>')
				}
			}
			$ul.append('<li class="disabled"><a>...</a></li>')
			$ul.append('<li><a href="./jslist.jsp?type=json&page='+ 
					total +'">' + total +'</a></li>')
		}
		
		if(currentPage>=5 && currentPage <= (total -5)){
			$ul.append('<li><a href="./jslist.jsp?type=json&page=0">0</a></li>')
			$ul.append('<li class="disabled"><a>...</a></li>')
			for(var i=currentPage-3;i<currentPage+4;i++){
				if(i==currentPage){
					$ul.append('<li class="active"><a href="./jslist.jsp?type=json&page=' +
							i + '">'+
							i +'</a></li>')
				}else{
					$ul.append('<li><a href="./jslist.jsp?type=json&page=' +
							i + '">'+
							i +'</a></li>')
				}
			}
			$ul.append('<li class="disabled"><a>...</a></li>')
			$ul.append('<li><a href="./jslist.jsp?type=json&page='+total+'">'+total+'</a></li>')
		}
		
		if(currentPage> (total - 5)){
			$ul.append('<li><a href="./jslist.jsp?type=json&page=0">0</a></li>')
			$ul.append('<li class="disabled"><a>...</a></li>')
			for(var i=currentPage - 3; i<=total ;i++){
				if(i==currentPage){
					$ul.append('<li class="active"><a href="./jslist.jsp?type=json&page=' +
							i + '">'+
							i +'</a></li>')
				}else{
					$ul.append('<li><a href="./jslist.jsp?type=json&page=' +
							i + '">'+
							i +'</a></li>')
				}
			}
			
		}
		if (currentPage == total) {
			console.log('currentPage: ' + currentPage);
			$ul.append('<li class="disabled"><span>&raquo;</span></li>')
		} else {
			console.log('currentPage: ' + currentPage);
			$ul.append('<li ><a href="./jslist.jsp?type=json&page=' +
					(currentPage + 1) +
					'">&raquo;</a></li>')
		}
	})
})